<!-- 登录|注册 -->
<div class="loginBox">
    <div class="loginLink">
        <a [routerLink]="[ '/login' ]">登录</a> |
        <a [routerLink]="[ '/login' ]">注册</a>
    </div>
</div>

<!-- 菜单swiper -->
<div class="swiperBox">
    <div class="navWrap" *ngFor="let wrap of swiperList, let actI = index" [style.display]="actI===actP ? 'flex' : 'none'">
            <div class="navs" *ngFor="let item of wrap">
                <div class="imgBox">
                    <img [src]="item.image_url" [alt]="item.title">
                </div>
                <div class="titleBox">{{item.title}}</div>
            </div>
    </div>
    <div class="dots">
        <span [class]="{'active':actP===i}" *ngFor="let item of swiperList, let i = index"
            (click)="swip(i)">{{i+1}}</span>
    </div>

</div>

<!-- 附近商家 -->
<div class="shopSection">
    <div class="shopListTitle">附近商家</div>
    <div class="shopBox" *ngFor="let shop of shopsData">
        <div class="imgBox">
            <img src="" alt="商铺头像">
        </div>
        <div class="shopContent">
            <div class="scTop">
              <div class="sign">品牌</div>
              <h4>{{shop.name}}</h4> 
            </div>
            <div class="scMiddle">
                <span class="score">{{shop.rating}}</span>
                <span class="monthlySales">月售{{shop.recent_order_num}}单</span>
            </div>
            <div class="scBottom">
                <span>￥{{shop.float_minimum_order_amount}}起送  配送费约¥{{shop.float_delivery_fee}}</span>
            </div>
        </div>
        <div class="shopSend">
            <div class="bzp"><span *ngFor="let spp of shop.supports">{{spp.icon_name}}&nbsp;</span></div>
            <div class="tagBox"><span class="tags">{{shop.delivery_mode.text}}</span></div>
        </div>
    </div>
</div>